import Qt 4.7

Item {
    // api
    property int mood: 0
    property alias comment: valueNotes.text

    // internal
    id: moodSelector

    Item {
        id: leftColumn
        anchors.top:  parent.top
        anchors.left: parent.left
        anchors.leftMargin: 20
        anchors.bottom: parent.bottom
        width:  150
        Text {
            id: textMood
            anchors.left: parent.left
            anchors.right: parent.right
            horizontalAlignment: Text.AlignHCenter
            font {
                family: appItem.applicationFont
                pixelSize: appItem.applicationFontSize
            }
            color: heiaLightGrey
            text: qsTr("Mood")
        }

        Image {
            id: moodExpression
            source: "mood0.png"
            anchors.right: parent.right
            anchors.rightMargin: 0
            anchors.bottom:  parent.bottom
            anchors.bottomMargin: 10

            state:  "mood0"

            states: [
                State {
                    name: "mood0"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood0.png"
                    }
                },
                State {
                    name: "mood1"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood1.png"
                    }
                },
                State {
                    name: "mood2"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood2.png"
                    }
                },
                State {
                    name: "mood3"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood3.png"
                    }
                },
                State {
                    name: "mood4"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood4.png"
                    }
                },
                State {
                    name: "mood5"
                    PropertyChanges {
                        target: moodExpression;
                        source: "mood5.png"
                    }
                }
            ]
            MouseArea {
                anchors.fill: parent
                onPressed: { // When clicked, change state to next available
                    var mood = moodExpression.state;
                    var moodInt = 0;
                    switch(mood) {
                    case "mood0":
                        mood = "mood1";
                        moodInt = 1;
                        break;
                    case "mood1":
                        mood = "mood2";
                        moodInt = 2;
                        break;
                    case "mood2":
                        mood = "mood3";
                        moodInt = 3;
                        break;
                    case "mood3":
                        mood = "mood4";
                        moodInt = 4;
                        break;
                    case "mood4":
                        mood = "mood5";
                        moodInt = 5;
                        break;
                    default:
                        mood = "mood0";
                    }
                    moodExpression.state = mood;
                    moodSelector.mood = moodInt;
                    console.debug("Selected mood: "+moodSelector.mood);
                }
            }
        }
    }


    Column {
        id: rightColumn
        anchors.left:  leftColumn.right
        anchors.right:  parent.right
        anchors.top:  parent.top
        anchors.bottom:  parent.bottom

        Text {
            id: textNotes
            font {
                family: appItem.applicationFont
                pixelSize: appItem.applicationFontSize
            }
            color: heiaLightGrey
            text: qsTr("Comment")
        }

        BorderImage {
            id: inputNotes
            clip: true

            anchors {
                top: textNotes.bottom
                bottom: parent.bottom
                left: parent.left
                right:  parent.right
                margins: 15
            }

            height: 96
            border { left: 6; top: 6; right: 6; bottom: 6 }
            source: "textbox.png"

            TextEdit {
                id: valueNotes
                clip: true

                anchors {
                    fill: parent
                    margins: 10
                }

                font {
                    family: appItem.applicationFont
                    pixelSize: appItem.applicationFontSize
                }

                wrapMode: TextEdit.Wrap
            }
        }
    }
}
